<template>
  <div>
    <van-nav-bar title="标题" left-text="返回" left-arrow>
      <template #right>
        <van-icon name="search" size="18" />
      </template>
    </van-nav-bar>
    <div style="display: flex;">
      <div>
      <div class="center">
        <van-sidebar v-model="activeKey">
          <van-sidebar-item title="推荐" to="/fenlei/childer" />
          <van-sidebar-item title="蛋糕">1</van-sidebar-item>
          <van-sidebar-item title="面包">2</van-sidebar-item>
          <van-sidebar-item title="饼干" />
          <van-sidebar-item title="甜点饮料" />
          <van-sidebar-item title="西餐西点" />
          <van-sidebar-item title="零食" />
          <van-sidebar-item title="面食" />
          <van-sidebar-item title="月饼点心" />
          <van-sidebar-item title="烤箱菜" />
          <van-sidebar-item title="家常菜" />
          <van-sidebar-item title="其他" />
        </van-sidebar>
      </div>
    </div>
    <router-view />
    </div>
    
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeKey: 0,
    };
  },
};
</script>

<style lang="scss" scoped>
.center {
  display: flex;
  
}
</style>